<template>
  <div>
    <div class="app-container">
      <div class="search-container">
        <el-form :inline="true" :model="queryParams" class="demo-form-inline">
          <el-form-item label="转舍日期">
            <el-date-picker v-model="queryParams.sheepRescissionDateAction" type="datetime" placeholder="开始日期"
              format="YYYY-MM-DD" />-
            <el-date-picker v-model="queryParams.sheepRescissionDateEnd" type="datetime" placeholder="结束日期"
              format="YYYY-MM-DD" />
          </el-form-item>
          <el-form-item label="羊只耳号">
            <el-input v-model="queryParams.earTag" placeholder="请输入耳号" clearable />
          </el-form-item>
          <el-form-item label="转舍类型">
            <el-select v-model="queryParams.roundType" placeholder="转舍类型" clearable style="width: 150px">
              <el-option label="请选择" :value="0" />
              <el-option v-for="item in sheepType" :label="item.name" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="转出栋舍">
            <el-select v-model="queryParams.outBuildingManageId" placeholder="转出栋舍" clearable style="width: 150px">
              <el-option label="请选择" :value="0" />
              <el-option v-for="item in cottages" :label="item.ridgepoleName" :value="item.ridgepoleId"
                @click="getColumns(item.ridgepoleId)" />
            </el-select>
          </el-form-item>
          <el-form-item label="转出栏位">
            <el-select v-model="queryParams.outColumMangementId" placeholder="转出栏位" clearable style="width: 150px">
              <el-option label="请选择" :value="0" />
              <el-option v-for="item in columns" :label="item.columnName" :value="item.columnManagementId" />
            </el-select>
          </el-form-item>
          <el-form-item label="转入栋舍">
            <el-select v-model="queryParams.toBuildingManageId" placeholder="转入栋舍" clearable style="width: 150px">
              <el-option label="请选择" :value="0" />
              <el-option v-for="item in cottages" :label="item.ridgepoleName" :value="item.ridgepoleId"
                @click="getColumns2(item.ridgepoleId)" />
            </el-select>
          </el-form-item>
          <el-form-item label="转入栏位">
            <el-select v-model="queryParams.toColumMangementId" placeholder="转入栏位" clearable style="width: 150px">
              <el-option label="请选择" :value="0" />
              <el-option v-for="item in columns2" :label="item.columnName" :value="item.columnManagementId" />
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="danger" @click="getAblactationList()">
              <el-icon>
                <Search />
              </el-icon>
              查询
            </el-button>
            <el-button type="danger" @click="hrefAdd()">
              <el-icon>
                <Plus />
              </el-icon>
              新增
            </el-button>
            <el-button type="danger" @click="removeRangDeli()" :disabled="true">
              <el-icon>
                <Close />
              </el-icon>
              删除
            </el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>

    <div class="app-container">
      <div class="search-container">
        <div class="select1">
          <el-table height="750px" :data="rescissions" @selection-change="handleSelectionChange" border>
            <el-table-column type="selection" width="55" />
            <el-table-column prop="earTag" label="羊只耳号" align="center" width="100" fixed />
            <el-table-column prop="sheepRescissionDate" label="转舍日期" align="center" width="100" fixed>
              <template #default="scope">
                <el-tag>{{ scope.row.sheepRescissionDate ? moment(scope.row.sheepRescissionDate).format("YYYY-MM-DD") :
          "---"
                  }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="roundType" fixed label="转舍类型" align="center" width="100">
              <template #default="scope">
                <span v-if="scope.row.roundType == 1">种母配种转舍</span>
                <span v-if="scope.row.roundType == 2">种母妊检转舍</span>
                <span v-if="scope.row.roundType == 3">种母分娩转舍</span>
                <span v-if="scope.row.roundType == 4">种母产羔转舍</span>
                <span v-if="scope.row.roundType == 5">种母断奶转舍</span>
                <span v-if="scope.row.roundType == 6">后备转种转舍</span>
                <span v-if="scope.row.roundType == 7">羊只期初转舍</span>
                <span v-if="scope.row.roundType == 8">羊只采购转舍</span>
                <span v-if="scope.row.roundType == 9">公羊调教转舍</span>
                <span v-if="scope.row.roundType == 10">羔羊断奶转舍</span>
                <span v-if="scope.row.roundType == 11">产羔登记转舍</span>
                <span v-if="scope.row.roundType == 12">后裔转种转舍</span>
                <span v-if="scope.row.roundType == 13">羊只转舍</span>
                <span v-if="scope.row.roundType == 14">羊只戴标转舍</span>
              </template>
            </el-table-column>
            <el-table-column prop="nowRidgepoleName" label="转出栋舍" align="center" width="100">
            </el-table-column>
            <el-table-column prop="nowColumnName" label="转出栏位" align="center" width="100">
            </el-table-column>
            <el-table-column prop="goRidgepoleName" label="转入栋舍" align="center" width="100" />
            <el-table-column prop="goRidgepoleName" label="转入栏位" align="center" />
            <el-table-column prop="variety" label="品种" align="center">
              <template #default="scope">
                <el-tag type="primary" v-if="scope.row.variety == 1">杜泊</el-tag>
                <el-tag type="primary" v-if="scope.row.variety == 2">澳洲白</el-tag>
                <el-tag type="primary" v-if="scope.row.variety == 3">萨福克</el-tag>
                <el-tag type="primary" v-if="scope.row.variety == 4">杜湖</el-tag>
                <el-tag type="primary" v-if="scope.row.variety == 5">杜杜湖</el-tag>
                <el-tag type="primary" v-if="scope.row.variety == 6">萨杜湖</el-tag>
                <el-tag type="primary" v-if="scope.row.variety == 7">澳湖</el-tag>
                <el-tag type="primary" v-if="scope.row.variety == 8">湖羊</el-tag>
                <el-tag type="primary" v-if="scope.row.variety == 9">澳杜湖</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="sheepRescissionSex" label="性别" align="center">
              <template #default="scope">
                <el-tag type="danger" v-if="scope.row.sheepRescissionSex == false">母</el-tag>
                <el-tag type="primary" v-if="scope.row.sheepRescissionSex == true">公</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="createName" label="创建人" align="center" />
            <el-table-column prop="createTime" label="创建时间" align="center">
              <template #default="scope">
                <el-tag>{{
          scope.row.createTime
            ? moment(scope.row.createTime).format("YYYY-MM-DD")
            : "---"
        }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="updateName" label="修改人" align="center">
              <template #default="scope">
                <el-tag>{{
          scope.row.updateName ? scope.row.updateName : "---" }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="updateTime" label="修改时间" align="center">
              <template #default="scope">
                <el-tag>{{
          scope.row.updateTime
            ? moment(scope.row.updateTime).format("YYYY-MM-DD")
            : "---"
        }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="documentNumber" label="单据号" align="center" />
            <!-- <el-table-column prop="weaning_SerialNumber" label="流水号" align="center" /> -->
            <!-- <el-table-column fixed="right" label="操作" align="center" width="200px">
              <template #default="scope">
                <el-button type="primary" link @click="getEweWeaning(scope.row.id)">编辑</el-button>
                <el-button type="primary" link @click="removeDeli(scope.row.id)">删除</el-button>
              </template>
            </el-table-column> -->
          </el-table>
        </div>
        <div style="margin-top: -30px; margin-left: 580px">
          <el-pagination v-model:current-page="queryParams.pageIndex" v-model:page-size="queryParams.pageSize"
            :page-sizes="[1, 2, 3, 5]" background layout="total, sizes, prev, pager, next, jumper" :total="total"
            @size-change="handleSizeChange" @current-change="handleCurrentChange" />
        </div>
      </div>
      <div>
        <el-dialog v-model="dialogFormVisible1" title="编辑种母断奶信息" width="600" style="height: 600px; text-align: center"
          destroy-on-close>
          <el-form ref="ruleFormRef" style="max-width: 600px" :model="editForm" :rules="rules" label-width="auto"
            class="demo-ruleForm" :size="formSize" status-icon>
            <el-row :span="24">
              <el-col :span="12">
                <el-form-item label="流水号">
                  <el-input v-model="editForm.weaning_SerialNumber" placeholder="流水号" />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="单据号">
                  <el-input v-model="editForm.weaning_DocumentNumber" placeholder="单据号" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :span="24">
              <el-col :span="12">
                <el-form-item label="负责人" prop="weaning_Principal">
                  <el-select v-model="editForm.weaning_Principal">
                    <el-option v-for="item in principals" :label="item.personage_Name" :value="item.personage_Name" />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="断奶日期" prop="weaning_Date">
                  <el-date-picker v-model="editForm.weaning_Date" type="date" value-format="YYYY-MM-DD"
                    placeholder="请选择" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :span="24">
              <el-col :span="12">
                <el-form-item label="种母耳号" prop="eartage">
                  <el-input v-model="editForm.eartage" placeholder="种母耳号" :disabled="true" />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="哺乳天数" prop="weaning_PregnancyDays">
                  <el-input v-model="editForm.weaning_PregnancyDays" style="width: 150px" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :span="24">
              <el-col :span="12">
                <el-form-item label="当前栋舍" prop="weaning_CurrentCottage">
                  <el-select v-model="editForm.weaning_CurrentCottage" placeholder="请选择栋舍" style="width: 150px"
                    :disabled="true">
                    <el-option v-for="item in cottages" :label="item.room_Name" :value="item.room_Name"
                      @click="getFields(item.id)" />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="当前栏位" prop="weaning_CurrentField">
                  <el-select v-model="editForm.weaning_CurrentField" placeholder="请选择栏位" style="width: 150px"
                    :disabled="true">
                    <el-option v-for="item in fields" :label="item.field_Name" :value="item.field_Name" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :span="24">
              <el-col :span="12">
                <el-form-item label="转入栋舍" prop="weaning_ToCottage">
                  <el-select v-model="editForm.weaning_ToCottage" placeholder="请选择栋舍" :disabled="false"
                    style="width: 150px">
                    <el-option v-for="item in cottages" :label="item.room_Name" :value="item.room_Name"
                      @click="getFields(item.id)" />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="转入栏位" prop="weaning_ToField">
                  <el-select v-model="editForm.weaning_ToField" placeholder="请选择栏位" :disabled="false"
                    style="width: 150px">
                    <el-option v-for="item in fields" :label="item.field_Name" :value="item.field_Name" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :span="24">
              <el-col :span="12">
                <el-form-item label="断奶只数" prop="weaning_WeanNum">
                  <el-input v-model="editForm.weaning_WeanNum" style="width: 150px" />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="断奶总窝重（公斤）" prop="weaning_WeanTotalWeight">
                  <el-input v-model="editForm.weaning_WeanTotalWeight" style="width: 150px" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :span="24">
              <el-col :span="12">
                <el-form-item label="种母重量（公斤）" prop="weaning_Eweweight">
                  <el-input v-model="editForm.weaning_Eweweight" style="width: 150px" />
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="备注">
                  <el-input v-model="editForm.weaning_Comment" type="textarea" placeholder="请输入备注信息" />
                </el-form-item>
              </el-col>
            </el-row>
            <div style="text-align: right; float: right">
              <el-form-item label="">
                <el-button type="danger" @click="submitForm(ruleFormRef)">
                  编辑
                </el-button>
                <el-button @click="resetForm(ruleFormRef, editForm.id)">重置</el-button>
              </el-form-item>
            </div>
          </el-form>
        </el-dialog>
      </div>
    </div>

    <!-- 分页 -->
    <table style="margin: 8px auto">
      <tr>
        <el-pagination v-model:current-page="queryParams.pageIndex" v-model:page-size="queryParams.pageSize"
          :page-sizes="[10, 15, 30, 50]" :background="true" layout="total, sizes, prev, pager, next, jumper"
          :total="page.totalCount" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
      </tr>
    </table>
  </div>

</template>
<script setup lang="ts">
import { useRouter, useRoute } from "vue-router";
import type { ComponentSize, FormInstance, FormRules } from "element-plus";
import { ref, reactive, onMounted } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import sheepAblactation from '@/api/ProductionManagement/SheepAblactation/index'
import sheepRescissions from '@/api/ProductionManagement/SheepRescissions/index'
//moment(scope.row.ablactation).format('YYYY-MM-DD') 将 ablactation 字段的日期字符串转换为年月日格式。确保 ablactation 是一个符合 Moment.js 可解析的日期格式或者是一个有效的日期对象。
import moment from 'moment';
const router = useRouter()
const route = useRoute()

//生命周期函数
onMounted(() => {
  //获取负责人
  getPrincipals()
  //获取栋舍
  getRidgepole()
  //获取种母断奶列表
  getAblactationList()
  //获取羊只类型
  getSheepType()
})
//分页
const page = reactive({
  totalCount: 0,
  pageCount: 0
})
//调整页容量
const handleSizeChange = (val: number) => {
  queryParams.pageSize = val
  getAblactationList()
}
//调整页码
const handleCurrentChange = (val: number) => {
  queryParams.pageIndex = val
  getAblactationList()
}
//查询条件
const queryParams: any = reactive({
  pageIndex: 1,
  pageSize: 15,
  sheepRescissionDateAction: "",
  sheepRescissionDateEnd: "",
  earTag: "",
  roundType: 0,
  outBuildingManageId: 0,
  outColumMangementId: 0,
  toBuildingManageId: 0,
  toColumMangementId: 0
});
//获取羊只类型
const sheepType = ref()
const getSheepType = () => {
  sheepRescissions.getSheepType().then(res => {
    sheepType.value = res.data
    console.log(res.data)
  })
}
//获取羊只转舍列表
const rescissions = ref()
const getAblactationList = () => {
  sheepRescissions.getSheepRescissions(queryParams).then(res => {
    rescissions.value = res.data.data
    console.log(rescissions.value)
    page.totalCount = res.data.totalCount
    page.pageCount = res.data.pageCount
  })
}
//新增羊只转舍
const hrefAdd = () => {
  router.push({
    path: '/SheepRescissionAdd'
  })
}
//获取栋舍
const cottages: any = ref([])
const getRidgepole = () => {
  sheepAblactation.getRidgepoleAsync().then(res => {
    cottages.value = res.data.data
  })
}
//获取栏位根据栋舍Id
const columns = ref([])
const getColumns = (ridgepoleId: number) => {
  columns.value = []
  sheepAblactation.getColumnByRidId(ridgepoleId).then(res => {
    columns.value = res.data
  })
}
//获取栏位根据栋舍Id2
const columns2 = ref([])
const getColumns2 = (ridgepoleId: number) => {
  columns2.value = []
  sheepAblactation.getColumnByRidId(ridgepoleId).then(res => {
    columns2.value = res.data
  })
}
//获取负责人
const principals = ref([])
const getPrincipals = () => {
  sheepAblactation.getSheepfileManagers().then(res => {
    principals.value = res.data
  })
}
//多选
const checked = ref({})
const delids = ref([])
const handleSelectionChange = (val: []) => {
  //清空数组
  delids.value = []
  checked.value = val
  checked.value.forEach(item => {
    delids.value.push(item.ablactationId)
  })
  console.log(delids.value)
}
//删除
const removeRangDeli = () => {
  if (delids.value.length == 0) {
    ElMessage.error('请选择要删除的数据')
    return
  }
  ElMessageBox.confirm(
    '确定要删除所选项吗?',
    '警告',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
      ElMessage({
        type: 'success',
        message: '删除成功',
      })
    })
    .catch(() => {
      ElMessage({
        type: 'info',
        message: '取消操作',
      })
    })
}


</script>
